package badge

import "github.com/templui/templui/internal/utils"

type Variant string

const (
	VariantDefault     Variant = "default"
	VariantSecondary   Variant = "secondary"
	VariantDestructive Variant = "destructive"
	VariantOutline     Variant = "outline"
)

type Props struct {
	ID         string
	Class      string
	Attributes templ.Attributes
	Variant    Variant
}

templ Badge(props ...Props) {
	{{ var p Props }}
	if len(props) > 0 {
		{{ p = props[0] }}
	}
	<span
		if p.ID != "" {
			id={ p.ID }
		}
		class={
			utils.TwMerge(
				"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none",
				"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
				"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
				"transition-[color,box-shadow] overflow-hidden",
				p.variantClasses(),
				p.Class,
			),
		}
		{ p.Attributes... }
	>
		{ children... }
	</span>
}

func (p Props) variantClasses() string {
	switch p.Variant {
	case VariantDestructive:
		return "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
	case VariantOutline:
		return "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
	case VariantSecondary:
		return "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90"
	default:
		return "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90"
	}
}
